<template>
    <div class=''>
        <Table stripe border :columns="columns" :data="data">
            <template slot-scope="{ row }" slot="action">
                <Button type="primary" size="small" @click="select(row.id)">选择</Button>
            </template>
        </Table>
        <div v-if="count>10" style="text-align: center;margin-top: 15px;">
            <Page :total="count" :page-size="10" show-elevator @on-change="changepage" />
        </div>
    </div>
</template>
<script>
import { service } from '../../utils/service.js'
export default {
    components: {},
    data() {
        //这里存放数据
        return {
            columns: [{
                    title: 'ID',
                    width: 80,
                    key: 'id',
                    align: 'center'
                },
                {
                    title: '标题',
                    key: 'title',
                    align: 'center'
                },
                {
                    title: '操作',
                    slot: 'action',
                    align: 'center',
                    width: 150
                }
            ],
            data: [],
            page: 1,
            count: 0
        };
    },
    //监听属性 类似于data概念
    computed: {},
    //监控data中的数据变化
    watch: {},
    //方法集合,
    methods: {
        getlist() {
            var that = this
            that.$http.post(service.get_theme, { page: that.page })
                .then(function(response) {
                    if (response.data.code == 1) {
                        that.data = response.data.data.list
                        that.count = response.data.data.count
                    }
                })
                .catch(() => {
                    that.$Message.error('网络错误');
                });
        },
        select(id) {
            var that = this

            that.$http.post(service.design_data, { id: id })
                .then(function(response) {

                    if (response.data.code == 1) {
                        if (response.data.data.config) {
                            that.$store.state.dataconfig = response.data.data.config.dataconfig
                        }

                        that.$store.state.baseData.config.dataconfig = response.data.data.config.dataconfig
                        that.$Message.success('表单复制成功');
                    } else {

                        that.$Message.error('表单复制失败');
                    }
                    that.$emit("close");
                })
                .catch(() => {
                    that.$Message.error('网络错误');
                });
        },
        changepage(num) {
            this.page = num
            this.getlist()
        }
    },
    //生命周期 - 创建完成（可以访问当前this实例）
    created() {

    },
    //生命周期 - 挂载完成（可以访问DOM元素）
    mounted() {
        this.getlist()
    }
}
</script>
<style lang='less' scoped>
</style>